{% extends "base.html" %}
{% block body %}
{% import "bootstrap/wtf.html" as wtf %}
</br>
<div class="row">
    <div class="col" style="position: relative; left: 80px;">
        <div class="btn-toolbar" role="toolbar">
            <div class="btn-group dropdown" role="group" aria-label="">
                <button class="btn btn-warning dropdown-toggle" data-toggle="dropdown" id="dropdown-rotate"
                    aria-haspopup="true" aria-expanded="false">
                    旋转
                    <span class="caret"></span>
                </button>
                <ul class="dropdown-menu" aria-labelledby="dropdown-rotate">
                    <li><a href="{{ url_for('rotate2') }}">顺时针</a></li>
                    <li><a href="{{ url_for('rotate1') }}">逆时针</a></li>
                    <li role="separator" class="divider"></li>
                    <li><a href="#" data-toggle="modal" data-target="#RotateModal">自定义</a></li>
                </ul>
            </div>

            <div class="btn-group dropdown" role="group" aria-label="">
                <button class="btn btn-warning dropdown-toggle" data-toggle="dropdown" id="dropdown-zoom"
                    aria-haspopup="true" aria-expanded="false">
                    缩放
                    <span class="caret"></span>
                </button>
                <ul class="dropdown-menu" aria-labelledby="dropdown-zoom">
                    <li><a href="#" onclick="zoom_In();">放大</a></li>
                    <li><a href="#" onclick="zoom_Out();">缩小</a></li>
                </ul>
            </div>
            <div class="btn-group" role="group" aria-label="">
                <button class="btn btn-warning">添加文字</button>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="RotateModal" tabindex="-1" role="dialog">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="myModalLabel">旋转</h4>
            </div>
            <div class="modal-body">
                {{ wtf.quick_form(rotate_form) }}
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-dark" data-dismiss="modal">关闭</button>
            </div>
        </div>
    </div>
</div>
<script>
</script>
{% endblock %}
